<!--Dropdown Menu Bottom Left-->
<p>Bottom Left Direction</p>
<span class="dropdown pmd-dropdown clearfix">
    <button class="btn btn-sm pmd-btn-fab pmd-btn-flat pmd-ripple-effect btn-primary" type="button" id="dropdownMenuBottomLeft" data-toggle="dropdown" aria-expanded="true"><i class="material-icons pmd-sm">more_vert</i></button>
    <ul aria-labelledby="dropdownMenu2" role="menu" class="dropdown-menu">
        <li class="dropdown-header" role="presentation">Dropdown header</li>
        <li role="presentation"><a href="javascript:void(0);" tabindex="-1" role="menuitem">Action</a></li>
        <li role="presentation"><a href="javascript:void(0);" tabindex="-1" role="menuitem">Another action</a></li>
        <li role="presentation"><a href="javascript:void(0);" tabindex="-1" role="menuitem">Something else here</a></li>
        <li class="dropdown-header" role="presentation">Dropdown header</li>
        <li role="presentation"><a href="javascript:void(0);" tabindex="-1" role="menuitem">Separated link</a></li>
    </ul>
</span>
                										
                                        				
<!--Dropdown Menu Bottom Right-->
<p>Bottom Right Direction</p>		
<span class="dropdown pmd-dropdown clearfix">
    <button class="btn btn-sm pmd-btn-fab pmd-btn-flat pmd-ripple-effect btn-primary" type="button" id="dropdownMenuBottomRight" data-toggle="dropdown" aria-expanded="true"><i class="material-icons pmd-sm">more_vert</i></button>
    <ul aria-labelledby="dropdownMenuDivider" role="menu" class="dropdown-menu dropdown-menu-right">
        <li role="presentation"><a href="javascript:void(0);" tabindex="-1" role="menuitem">Action</a></li>
        <li role="presentation"><a href="javascript:void(0);" tabindex="-1" role="menuitem">Another action</a></li>
        <li role="presentation"><a href="javascript:void(0);" tabindex="-1" role="menuitem">Something else here</a></li>
        <li class="divider" role="presentation"></li>
        <li role="presentation"><a href="javascript:void(0);" tabindex="-1" role="menuitem">Separated link</a></li>
    </ul>
</span>
                                        				
                                        				
<!--Dropdown Menu Top Left-->
<p>Top Left Direction</p>	
<span class="dropdown pmd-dropdown dropup clearfix">
    <button class="btn btn-sm pmd-btn-fab pmd-btn-flat pmd-ripple-effect btn-primary" type="button" id="dropdownMenuTopLeft" data-toggle="dropdown" aria-expanded="true"><i class="material-icons pmd-sm">more_vert</i></button>
    <ul aria-labelledby="dropdownMenu3" role="menu" class="dropdown-menu pmd-dropdown-menu-top-left">
        <li role="presentation"><a href="javascript:void(0);" tabindex="-1" role="menuitem">Regular link</a></li>
        <li class="disabled" role="presentation"><a href="javascript:void(0);" tabindex="-1" role="menuitem">Disabled link</a></li>
        <li role="presentation"><a href="javascript:void(0);" tabindex="-1" role="menuitem">Another link</a></li>
    </ul>
</span>
                                        				
                                        				
<!--Dropdown Menu Top Right-->
<p>Top Right Direction</p>	
<span class="dropdown dropup pmd-dropdown clearfix">
    <button class="btn btn-sm pmd-btn-fab pmd-btn-flat pmd-ripple-effect btn-primary" type="button" id="dropdownMenuTopRight" data-toggle="dropdown" aria-expanded="true"><i class="material-icons pmd-sm">more_vert</i></button>
    <ul aria-labelledby="dropdownMenu3" role="menu" class="dropdown-menu pmd-dropdown-menu-top-right">
        <li role="presentation"><a href="javascript:void(0);" tabindex="-1" role="menuitem">Regular link</a></li>
        <li class="disabled" role="presentation"><a href="javascript:void(0);" tabindex="-1" role="menuitem">Disabled link</a></li>
        <li role="presentation"><a href="javascript:void(0);" tabindex="-1" role="menuitem">Another link</a></li>
    </ul>
</span>
                                        				